<template>
    <dark-mode-container class="flex-center h-full" :inverted="theme.footer.inverted">
        <a
            v-if="websiteApprove.sn"
            class="mr-24px"
            :href="websiteApprove.link"
            target="_blank"
            >{{ websiteApprove.sn }}</a
        >

        <a v-if="copyright.text" :href="copyright.link" target="_blank"
            >Copyright {{ copyright.text }}</a
        >
    </dark-mode-container>
</template>

<script setup lang="ts">
import { computed } from 'vue'
import { useAppStore, useThemeStore } from '@/store'

defineOptions({ name: 'GlobalFooter' })

const theme = useThemeStore()
const app = useAppStore()
const websiteApprove = computed(() => {
    return {
        sn: app.websiteApproveSn,
        link: app.websiteApproveLink
    }
})

const copyright = computed(() => {
    return {
        text: app.copyRight,
        link: app.copyRightLink
    }
})
</script>

<style scoped></style>
